<template>
  <div class="containery">
    <p>我的团队</p>
    <el-collapse v-model="activeNames" @change="handleChange" class="ul">
      <el-collapse-item :title="item.title" :name="index" style="flex-grow:1;"  v-for="(item,index) in dataList" :key="index">
        <ul>
          <li v-for="(itema,indexa) in item.users" :key="indexa">
            <i class="iconfont">&#xe673;</i>
            {{itema.name}}
          </li>
        </ul>
      </el-collapse-item>
    </el-collapse>
  </div>
</template>

<script>
import store from '@/vuex/store.js'
export default {
  data () {
    return {
      activeNames: [],
      dataList:[],
    }
  },
  store,
  methods: {
    handleChange(val) {
      // console.log(val);
    }
  },
  mounted () {
    store.commit('changeactive', 1)
    let id = JSON.parse(sessionStorage.getItem('userinfo')).managed_teams.id
    this.$api.Team.user(id).then(res=>{
      this.dataList = res.data.data
    })
  }
}
</script>

<style lang='scss' scoped>
@import '../../assets/css/iconfonta.css';
.containery{
  margin-left: 20px;
  font-size: 14px;
  color: #515151;
  >p{
    font-weight: bold;
    font-size: 16px;
  }
  .ul{
    margin-top: 30px;
    width: 40%;
    cursor: default;
    li{
      display: flex;
      align-items: center;
      i{
        margin-right: 10px;
      }
    }
  }
}
</style>